<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="vue_dev.js"></script>
    <!--WTF start-->
    <style type="text/css">
        .timepicker-wrap {
            display: inline-block;
            position: relative
        }

        .timepicker-wrap *,
        .timepicker-wrap :after,
        .timepicker-wrap :before {
            box-sizing: border-box
        }

        .time {
            border: 1px solid rgba(0, 0, 0, .1);
            padding: 15px 10px 15px 40px;
            border-radius: 3px;
            font-size: 1.2rem;
            width: 120px;
            text-align: center
        }

        .flex-wrap {
            display: flex;
            position: relative
        }

        .timepicker-icon {
            position: absolute;
            left: 15px;
            top: 50%;
            display: inline-block;
            width: 1em;
            height: 1em;
            stroke-width: 0;
            stroke: currentColor;
            fill: currentColor;
            transform: translateY(-50%)
        }

        .timepicker {
            position: absolute;
            background: #fbfbff;
            width: 100vw;
            box-shadow: 0 3px 10px rgba(0, 0, 0, .3);
            border-radius: 3px;
            overflow: hidden;
            left: 50%;
            top: -135px;
            border-radius: 50%;
            transition: all .3s ease;
            transform: translate3d(-50%, 0, 0) scale(0);
            pointer-events: none;
            will-change: border-radius
        }

        @media (min-width:480px) {
            .timepicker {
                width: 250px;
                border-radius: 0
            }
        }

        .timepicker.is-open {
            transform: translate3d(-50%, 0, 0) scale(1);
            border-radius: 3px;
            pointer-events: auto
        }

        .timepicker__header {
            padding: 5px 15px;
            font-size: 14px;
            color: #fff;
            background: #f25f5c
        }

        .timepicker__time {
            position: relative;
            overflow: hidden;
            background: #f68d8b;
            display: flex;
            justify-content: center;
            font-size: 50px;
            color: #fff;
            line-height: 1;
            padding: 12px 10px
        }

        .timepicker__active-bg {
            position: absolute;
            top: -25%;
            left: 0;
            width: 34px;
            height: 200%;
            background: #f25f5c;
            transition: transform .4s ease
        }

        .timepicker__separator {
            z-index: 2;
            position: relative;
            width: 34px;
            text-align: center;
            font-size: 90%
        }

        .time-unit {
            z-index: 4;
            position: relative;
            transition: transform .2s ease;
            -webkit-user-select: none;
            -webkit-tap-highlight-color: transparent
        }

        .time-unit:hover {
            transform: scale(1.1)
        }

        .time-unit__value {
            position: relative;
            display: inline-block;
            z-index: 2;
            color: #fff;
            font-size: 50px;
            line-height: 50px;
            padding: 0 2px;
            text-align: center;
            width: 34px;
            height: 50px;
            border: none;
            outline: none;
            cursor: pointer;
            transition: all .3s ease
        }

        .time-unit__value,
        .time-unit__value:active,
        .time-unit__value:focus {
            background: transparent
        }

        .time-unit__value-enter {
            opacity: 0;
            transform: translate3d(0, 2rem, 0) scale(.7)
        }

        .time-unit__value-leave-active {
            position: absolute
        }

        .time-unit__value--reverse-enter,
        .time-unit__value-leave-active {
            opacity: 0;
            transform: translate3d(0, -2rem, 0) scale(.7)
        }

        .time-unit__value--reverse-leave-active {
            position: absolute;
            opacity: 0;
            transform: translate3d(0, 2rem, 0) scale(.7)
        }

        .triangle {
            display: inline-block;
            width: 1em;
            height: 1em;
            stroke-width: 0;
            stroke: currentColor;
            fill: currentColor
        }

        .numpad__digits {
            display: flex;
            flex-wrap: wrap;
            padding: 5px 20px
        }

        .numpad__digits .numpad__digit:last-of-type {
            margin-left: auto;
            margin-right: auto
        }

        .numpad__digit {
            position: relative;
            width: 33%
        }

        .numpad__digit button {
            position: relative;
            z-index: 2;
            display: block;
            width: 100%;
            padding: 20px 0;
            text-align: center;
            color: #757575;
            background: none;
            border: none;
            font-size: 16px;
            font-weight: 600;
            line-height: 1.3;
            cursor: pointer;
            transition: color .3s ease;
            outline: none;
            -webkit-user-select: none;
            -webkit-tap-highlight-color: transparent
        }

        @media (min-width:480px) {
            .numpad__digit button {
                padding: 15px 0
            }
        }

        .numpad__digit button.is-disabled {
            color: hsla(0, 0%, 46%, .3)
        }

        .numpad__digit button:focus+.numpad__ripple {
            opacity: .3;
            transform: translate(-50%, -50%) scale(1)
        }

        .numpad__arrows {
            display: flex;
            flex-wrap: wrap;
            position: absolute;
            padding: 5px 20px;
            bottom: 0;
            left: 0;
            right: 0;
            justify-content: space-between
        }

        .numpad__arrows button {
            font-size: 25px;
            padding: 17px 0 13px;
            line-height: 1
        }

        @media (min-width:480px) {
            .numpad__arrows button {
                padding: 13px 0 8px
            }
        }

        .numpad__ripple {
            z-index: 1;
            position: absolute;
            left: 50%;
            top: 50%;
            background: rgba(0, 0, 0, .2);
            border-radius: 50%;
            width: 55px;
            height: 55px;
            opacity: 0;
            transform: translate(-50%, -50%) scale(1.1);
            transition: .3s
        }

        @media (min-width:480px) {
            .numpad__ripple {
                width: 45px;
                height: 45px
            }
        }

        .numpad__ripple.is-pressed {
            opacity: .3;
            transform: translate(-50%, -50%) scale(1)
        }
    </style>
    <script>
        ! function (t, e) {
            "object" == typeof exports && "object" == typeof module ? module.exports = e() : "function" == typeof define &&
                define.amd ? define([], e) : "object" == typeof exports ? exports.VueTimepickr = e() : t.VueTimepickr =
                e()
        }(this, function () {
            return function (t) {
                function e(i) {
                    if (n[i]) return n[i].exports;
                    var r = n[i] = {
                        exports: {},
                        id: i,
                        loaded: !1
                    };
                    return t[i].call(r.exports, r, r.exports, e), r.loaded = !0, r.exports
                }
                var n = {};
                return e.m = t, e.c = n, e.p = "/", e(0)
            }([function (t, e, n) {
                "use strict";

                function i(t) {
                    return t && t.__esModule ? t : {
                        "default": t
                    }
                }
                Object.defineProperty(e, "__esModule", {
                    value: !0
                });
                var r = n(53),
                    s = i(r);
                e["default"] = s["default"]
            }, function (t, e) {
                "use strict";
                Object.defineProperty(e, "__esModule", {
                    value: !0
                });
                var n = [{
                    value: 1,
                    active: !0,
                    pressed: !1
                }, {
                    value: 2,
                    active: !0,
                    pressed: !1
                }, {
                    value: 3,
                    active: !0,
                    pressed: !1
                }, {
                    value: 4,
                    active: !0,
                    pressed: !1
                }, {
                    value: 5,
                    active: !0,
                    pressed: !1
                }, {
                    value: 6,
                    active: !0,
                    pressed: !1
                }, {
                    value: 7,
                    active: !0,
                    pressed: !1
                }, {
                    value: 8,
                    active: !0,
                    pressed: !1
                }, {
                    value: 9,
                    active: !0,
                    pressed: !1
                }, {
                    value: 0,
                    active: !0,
                    pressed: !1
                }];
                e["default"] = {
                    activeIndex: 0,
                    time: null,
                    isOpen: !1,
                    digits: n,
                    arrowKeys: {
                        left: {
                            pressed: !1
                        },
                        right: {
                            pressed: !1
                        }
                    }
                }
            }, function (t, e) {
                "use strict";

                function n(t, e) {
                    return t.indexOf(e) >= 0
                }

                function i(t, e) {
                    return t.forEach(function (t) {
                        t.active = n(e, t.value)
                    }), t
                }

                function r(t, e) {
                    return t.filter(function (t) {
                        return t.value === e
                    }).reduce(function (t, e) {
                        return e
                    }, {})
                }

                function s(t) {
                    return Number(t)
                }

                function o(t, e, n) {
                    var r = n.map(s);
                    return 0 === t ? r[1] > 3 ? i(e, [0, 1]) : i(e, [0, 1, 2]) : 1 === t ? 2 === r[0] ?
                        i(e, [0, 1, 2, 3]) : i(e, [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]) : 2 === t ? i(e, [0,
                            1, 2, 3, 4, 5
                        ]) : 3 === t ? i(e, [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]) : void 0
                }

                function u(t) {
                    return t.filter(function (t) {
                        return t.active
                    }).map(function (t) {
                        return t.value
                    })
                }
                Object.defineProperty(e, "__esModule", {
                        value: !0
                    }), e.getDigit = r, e.convertToNumber = s, e.filteredDigits = o, e.activeNumbers =
                    u
            }, function (t, e) {
                var n = t.exports = {
                    version: "2.4.0"
                };
                "number" == typeof __e && (__e = n)
            }, function (t, e, n) {
                "use strict";
                Object.defineProperty(e, "__esModule", {
                    value: !0
                });
                var i = n(2);
                e["default"] = {
                    methods: {
                        resetArrowsPressed: function () {
                            this.arrowKeys.left.pressed = !1, this.arrowKeys.right.pressed = !1
                        },
                        digitPressed: function (t) {
                            var e = (0, i.getDigit)(this.digits, t);
                            e.pressed = !0
                        },
                        arrowPressed: function (t) {
                            this.arrowKeys[t].pressed = !0
                        },
                        digitSelected: function (t, e) {
                            return e && e.preventDefault(), (0, i.getDigit)(this.digits, t).active ?
                                ((0, i.getDigit)(this.digits, t).pressed = !1, this.$set(this.time,
                                    this.activeIndex, t), 3 === this.activeIndex && (void 0 ===
                                    this.$parent.$parent ? this.$emit("close") : this.$parent
                                    .$parent.$emit("close")), void this.goToNext()) : void((0,
                                    i.getDigit)(this.digits, t).pressed = !1)
                        },
                        arrowSelected: function (t) {
                            if ("left" === t && this.goToPrevious(), "right" === t && this.goToNext(),
                                "up" === t) {
                                var e = parseInt(this.time[this.activeIndex]) + 1;
                                (0, i.activeNumbers)(this.filteredDigits).indexOf(e) > -1 &&
                                    this.$set(this.time, this.activeIndex, e)
                            }
                            if ("down" === t) {
                                var n = parseInt(this.time[this.activeIndex]) - 1;
                                (0, i.activeNumbers)(this.filteredDigits).indexOf(n) > -1 &&
                                    this.$set(this.time, this.activeIndex, n)
                            }
                        },
                        goToNext: function (t) {
                            t && t.preventDefault(), this.activeIndex < 3 && (this.activeIndex++,
                                this.arrowKeys.right.pressed = !1)
                        },
                        goToPrevious: function (t) {
                            t && t.preventDefault(), this.activeIndex > 0 && (this.activeIndex--,
                                this.arrowKeys.left.pressed = !1)
                        },
                        blurEl: function (t) {
                            t.blur()
                        }
                    }
                }
            }, function (t, e, n) {
                t.exports = !n(6)(function () {
                    return 7 != Object.defineProperty({}, "a", {
                        get: function () {
                            return 7
                        }
                    }).a
                })
            }, function (t, e) {
                t.exports = function (t) {
                    try {
                        return !!t()
                    } catch (e) {
                        return !0
                    }
                }
            }, function (t, e) {
                var n = t.exports = "undefined" != typeof window && window.Math == Math ? window :
                    "undefined" != typeof self && self.Math == Math ? self : Function("return this")();
                "number" == typeof __g && (__g = n)
            }, function (t, e) {
                t.exports = function (t) {
                    return "object" == typeof t ? null !== t : "function" == typeof t
                }
            }, function (t, e, n) {
                var i = n(34),
                    r = n(10);
                t.exports = function (t) {
                    return i(r(t))
                }
            }, function (t, e) {
                t.exports = function (t) {
                    if (void 0 == t) throw TypeError("Can't call method on  " + t);
                    return t
                }
            }, function (t, e, n) {
                var i = n(7),
                    r = n(3),
                    s = n(28),
                    o = n(32),
                    u = "prototype",
                    a = function (t, e, n) {
                        var c, f, d, l = t & a.F,
                            p = t & a.G,
                            v = t & a.S,
                            h = t & a.P,
                            m = t & a.B,
                            _ = t & a.W,
                            x = p ? r : r[e] || (r[e] = {}),
                            y = x[u],
                            b = p ? i : v ? i[e] : (i[e] || {})[u];
                        p && (n = e);
                        for (c in n) f = !l && b && void 0 !== b[c], f && c in x || (d = f ? b[c] : n[c],
                            x[c] = p && "function" != typeof b[c] ? n[c] : m && f ? s(d, i) : _ &&
                            b[c] == d ? function (t) {
                                var e = function (e, n, i) {
                                    if (this instanceof t) {
                                        switch (arguments.length) {
                                            case 0:
                                                return new t;
                                            case 1:
                                                return new t(e);
                                            case 2:
                                                return new t(e, n)
                                        }
                                        return new t(e, n, i)
                                    }
                                    return t.apply(this, arguments)
                                };
                                return e[u] = t[u], e
                            }(d) : h && "function" == typeof d ? s(Function.call, d) : d, h && ((x.virtual ||
                                (x.virtual = {}))[c] = d, t & a.R && y && !y[c] && o(y, c, d)))
                    };
                a.F = 1, a.G = 2, a.S = 4, a.P = 8, a.B = 16, a.W = 32, a.U = 64, a.R = 128, t.exports =
                    a
            }, function (t, e, n) {
                var i = n(36),
                    r = n(30);
                t.exports = Object.keys || function (t) {
                    return i(t, r)
                }
            }, function (t, e) {
                var n = Math.ceil,
                    i = Math.floor;
                t.exports = function (t) {
                    return isNaN(t = +t) ? 0 : (t > 0 ? i : n)(t)
                }
            }, function (t, e, n) {
                "use strict";

                function i(t) {
                    return t && t.__esModule ? t : {
                        "default": t
                    }
                }

                function r(t, e) {
                    return (0, d["default"])(e).indexOf(t) > -1
                }

                function s(t, e) {
                    var n = (0, d["default"])(e).indexOf(t);
                    return parseInt((0, c["default"])(e)[n])
                }

                function o(t, e) {
                    var n = (0, d["default"])(e).indexOf(t);
                    return (0, c["default"])(e)[n]
                }

                function u(t, e) {
                    return (0, d["default"])(e).indexOf(t) > -1
                }
                Object.defineProperty(e, "__esModule", {
                    value: !0
                });
                var a = n(20),
                    c = i(a),
                    f = n(21),
                    d = i(f),
                    l = n(2),
                    p = {
                        0: 48,
                        1: 49,
                        2: 50,
                        3: 51,
                        4: 52,
                        5: 53,
                        6: 54,
                        7: 55,
                        8: 56,
                        9: 57
                    },
                    v = {
                        left: 37,
                        right: 39,
                        up: 38,
                        down: 40
                    },
                    h = 27;
                e["default"] = {
                    mounted: function () {
                        var t = this;
                        window.addEventListener("keyup", this.onKeyUp), window.addEventListener(
                            "keydown", this.onKeyPressed), window.addEventListener("keyup",
                            function (e) {
                                e.keyCode === h && t.close(!0)
                            })
                    },
                    beforeDestroy: function () {
                        window.removeEventListener("keyup", this.onKeyUp), window.removeEventListener(
                            "keydown", this.onKeyPressed), window.addEventListener("keyup",
                            this.close)
                    },
                    methods: {
                        onKeyUp: function (t) {
                            if (this.isOpen) {
                                if (r(t.keyCode, p)) {
                                    var e = s(t.keyCode, p);
                                    (0, l.activeNumbers)(this.filteredDigits).indexOf(e) > -1 &&
                                        this.digitSelected(e)
                                }
                                if (u(t.keyCode, v)) {
                                    var n = o(t.keyCode, v);
                                    this.arrowSelected(n)
                                }
                                13 === t.keyCode && t.target.classList.contains("timepicker") &&
                                    this.close(), this.resetArrowsPressed()
                            }
                        },
                        onKeyPressed: function (t) {
                            if (this.isOpen) {
                                if (r(t.keyCode, p)) {
                                    var e = s(t.keyCode, p);
                                    (0, l.activeNumbers)(this.filteredDigits).indexOf(e) > -1 &&
                                        this.digitPressed(e)
                                }
                                if (u(t.keyCode, v)) {
                                    t.preventDefault();
                                    var n = o(t.keyCode, v);
                                    ("left" === n && this.activeIndex > 0 || "right" === n &&
                                        this.activeIndex < 3) && this.arrowPressed(n)
                                }
                            }
                        }
                    }
                }
            }, function (t, e, n) {
                "use strict";

                function i(t) {
                    return t && t.__esModule ? t : {
                        "default": t
                    }
                }
                Object.defineProperty(e, "__esModule", {
                    value: !0
                });
                var r = n(1),
                    s = i(r),
                    o = n(2),
                    u = n(14),
                    a = i(u),
                    c = n(4),
                    f = i(c),
                    d = n(54),
                    l = i(d),
                    p = n(57),
                    v = i(p),
                    h = n(56),
                    m = i(h);
                e["default"] = {
                    name: "Timepicker",
                    props: ["value"],
                    mixins: [a["default"], f["default"]],
                    components: {
                        ActiveBackground: l["default"],
                        TimeUnit: v["default"],
                        Numpad: m["default"]
                    },
                    data: function () {
                        return s["default"]
                    },
                    created: function () {
                        this.time = this.value.replace(":", "").split(""), this.$on("close",
                            this.close)
                    },
                    computed: {
                        filteredDigits: function () {
                            return (0, o.filteredDigits)(this.activeIndex, this.digits, this.time)
                        }
                    },
                    methods: {
                        open: function () {
                            this.time = this.value.replace(":", "").split(""), this.$refs.timeInput
                                .blur(), this.$refs.timepicker.focus(), this.isOpen = !0, this.activeIndex =
                                0
                        },
                        close: function (t) {
                            var e = t || !1;
                            e || this.setTime(), this.$refs.timepicker.blur(), this.isOpen = !1
                        },
                        setTime: function () {
                            this.$emit("input", "" + this.time[0] + this.time[1] + ":" + this.time[
                                2] + this.time[3])
                        }
                    }
                }
            }, function (t, e, n) {
                "use strict";

                function i(t) {
                    return t && t.__esModule ? t : {
                        "default": t
                    }
                }
                Object.defineProperty(e, "__esModule", {
                    value: !0
                });
                var r = n(1),
                    s = i(r);
                e["default"] = {
                    data: function () {
                        return s["default"]
                    },
                    computed: {
                        transform: function () {
                            var t = 34,
                                e = this.activeIndex < 2 ? this.activeIndex * t : this.activeIndex *
                                t + t;
                            return {
                                transform: "translate3d(" + e + "px, 0, 0)"
                            }
                        }
                    }
                }
            }, function (t, e, n) {
                "use strict";

                function i(t) {
                    return t && t.__esModule ? t : {
                        "default": t
                    }
                }
                Object.defineProperty(e, "__esModule", {
                    value: !0
                });
                var r = n(1),
                    s = i(r),
                    o = n(4),
                    u = i(o);
                e["default"] = {
                    name: "Number",
                    props: {
                        number: {
                            type: Object,
                            required: !0
                        }
                    },
                    mixins: [u["default"]],
                    data: function () {
                        return s["default"]
                    },
                    methods: {
                        selectedDigit: function (t) {
                            this.digitSelected(this.number.value, t), this.blurEl(this.$refs.numButton)
                        }
                    },
                    computed: {
                        isDisabled: function () {
                            !this.number.active || !this.isOpen
                        }
                    }
                }
            }, function (t, e, n) {
                "use strict";

                function i(t) {
                    return t && t.__esModule ? t : {
                        "default": t
                    }
                }
                Object.defineProperty(e, "__esModule", {
                    value: !0
                });
                var r = n(1),
                    s = i(r),
                    o = n(2),
                    u = n(4),
                    a = i(u),
                    c = n(55),
                    f = i(c);
                e["default"] = {
                    name: "Numpad",
                    components: {
                        Number: f["default"]
                    },
                    mixins: [a["default"]],
                    data: function () {
                        return s["default"]
                    },
                    computed: {
                        numbers: function () {
                            return (0, o.filteredDigits)(this.activeIndex, this.digits, this.time)
                        }
                    }
                }
            }, function (t, e, n) {
                "use strict";

                function i(t) {
                    return t && t.__esModule ? t : {
                        "default": t
                    }
                }
                Object.defineProperty(e, "__esModule", {
                    value: !0
                });
                var r = n(1),
                    s = i(r);
                e["default"] = {
                    props: ["value", "index"],
                    data: function () {
                        return {
                            store: s["default"],
                            numbers: [],
                            transitionName: "time-unit__value"
                        }
                    },
                    created: function () {
                        this.isInitialized = !0, this.numbers.push(this.value)
                    },
                    methods: {
                        setActiveIndex: function (t) {
                            this.store.activeIndex = parseInt(t)
                        }
                    },
                    watch: {
                        value: function (t, e) {
                            t !== e && (this.transitionName = t > e ? "time-unit__value" :
                                "time-unit__value--reverse", this.numbers.splice(0, 1),
                                this.numbers.push(t))
                        }
                    }
                }
            }, function (t, e, n) {
                t.exports = {
                    "default": n(22),
                    __esModule: !0
                }
            }, function (t, e, n) {
                t.exports = {
                    "default": n(23),
                    __esModule: !0
                }
            }, function (t, e, n) {
                n(48), t.exports = n(3).Object.keys
            }, function (t, e, n) {
                n(49), t.exports = n(3).Object.values
            }, function (t, e) {
                t.exports = function (t) {
                    if ("function" != typeof t) throw TypeError(t + " is not a function!");
                    return t
                }
            }, function (t, e, n) {
                var i = n(8);
                t.exports = function (t) {
                    if (!i(t)) throw TypeError(t + " is not an object!");
                    return t
                }
            }, function (t, e, n) {
                var i = n(9),
                    r = n(44),
                    s = n(43);
                t.exports = function (t) {
                    return function (e, n, o) {
                        var u, a = i(e),
                            c = r(a.length),
                            f = s(o, c);
                        if (t && n != n) {
                            for (; c > f;)
                                if (u = a[f++], u != u) return !0
                        } else
                            for (; c > f; f++)
                                if ((t || f in a) && a[f] === n) return t || f || 0;
                        return !t && -1
                    }
                }
            }, function (t, e) {
                var n = {}.toString;
                t.exports = function (t) {
                    return n.call(t).slice(8, -1)
                }
            }, function (t, e, n) {
                var i = n(24);
                t.exports = function (t, e, n) {
                    if (i(t), void 0 === e) return t;
                    switch (n) {
                        case 1:
                            return function (n) {
                                return t.call(e, n)
                            };
                        case 2:
                            return function (n, i) {
                                return t.call(e, n, i)
                            };
                        case 3:
                            return function (n, i, r) {
                                return t.call(e, n, i, r)
                            }
                    }
                    return function () {
                        return t.apply(e, arguments)
                    }
                }
            }, function (t, e, n) {
                var i = n(8),
                    r = n(7).document,
                    s = i(r) && i(r.createElement);
                t.exports = function (t) {
                    return s ? r.createElement(t) : {}
                }
            }, function (t, e) {
                t.exports =
                    "constructor,hasOwnProperty,isPrototypeOf,propertyIsEnumerable,toLocaleString,toString,valueOf"
                    .split(",")
            }, function (t, e) {
                var n = {}.hasOwnProperty;
                t.exports = function (t, e) {
                    return n.call(t, e)
                }
            }, function (t, e, n) {
                var i = n(35),
                    r = n(40);
                t.exports = n(5) ? function (t, e, n) {
                    return i.f(t, e, r(1, n))
                } : function (t, e, n) {
                    return t[e] = n, t
                }
            }, function (t, e, n) {
                t.exports = !n(5) && !n(6)(function () {
                    return 7 != Object.defineProperty(n(29)("div"), "a", {
                        get: function () {
                            return 7
                        }
                    }).a
                })
            }, function (t, e, n) {
                var i = n(27);
                t.exports = Object("z").propertyIsEnumerable(0) ? Object : function (t) {
                    return "String" == i(t) ? t.split("") : Object(t)
                }
            }, function (t, e, n) {
                var i = n(25),
                    r = n(33),
                    s = n(46),
                    o = Object.defineProperty;
                e.f = n(5) ? Object.defineProperty : function (t, e, n) {
                    if (i(t), e = s(e, !0), i(n), r) try {
                        return o(t, e, n)
                    } catch (u) {}
                    if ("get" in n || "set" in n) throw TypeError("Accessors not supported!");
                    return "value" in n && (t[e] = n.value), t
                }
            }, function (t, e, n) {
                var i = n(31),
                    r = n(9),
                    s = n(26)(!1),
                    o = n(41)("IE_PROTO");
                t.exports = function (t, e) {
                    var n, u = r(t),
                        a = 0,
                        c = [];
                    for (n in u) n != o && i(u, n) && c.push(n);
                    for (; e.length > a;) i(u, n = e[a++]) && (~s(c, n) || c.push(n));
                    return c
                }
            }, function (t, e) {
                e.f = {}.propertyIsEnumerable
            }, function (t, e, n) {
                var i = n(11),
                    r = n(3),
                    s = n(6);
                t.exports = function (t, e) {
                    var n = (r.Object || {})[t] || Object[t],
                        o = {};
                    o[t] = e(n), i(i.S + i.F * s(function () {
                        n(1)
                    }), "Object", o)
                }
            }, function (t, e, n) {
                var i = n(12),
                    r = n(9),
                    s = n(37).f;
                t.exports = function (t) {
                    return function (e) {
                        for (var n, o = r(e), u = i(o), a = u.length, c = 0, f = []; a > c;) s.call(
                            o, n = u[c++]) && f.push(t ? [n, o[n]] : o[n]);
                        return f
                    }
                }
            }, function (t, e) {
                t.exports = function (t, e) {
                    return {
                        enumerable: !(1 & t),
                        configurable: !(2 & t),
                        writable: !(4 & t),
                        value: e
                    }
                }
            }, function (t, e, n) {
                var i = n(42)("keys"),
                    r = n(47);
                t.exports = function (t) {
                    return i[t] || (i[t] = r(t))
                }
            }, function (t, e, n) {
                var i = n(7),
                    r = "__core-js_shared__",
                    s = i[r] || (i[r] = {});
                t.exports = function (t) {
                    return s[t] || (s[t] = {})
                }
            }, function (t, e, n) {
                var i = n(13),
                    r = Math.max,
                    s = Math.min;
                t.exports = function (t, e) {
                    return t = i(t), t < 0 ? r(t + e, 0) : s(t, e)
                }
            }, function (t, e, n) {
                var i = n(13),
                    r = Math.min;
                t.exports = function (t) {
                    return t > 0 ? r(i(t), 9007199254740991) : 0
                }
            }, function (t, e, n) {
                var i = n(10);
                t.exports = function (t) {
                    return Object(i(t))
                }
            }, function (t, e, n) {
                var i = n(8);
                t.exports = function (t, e) {
                    if (!i(t)) return t;
                    var n, r;
                    if (e && "function" == typeof (n = t.toString) && !i(r = n.call(t))) return r;
                    if ("function" == typeof (n = t.valueOf) && !i(r = n.call(t))) return r;
                    if (!e && "function" == typeof (n = t.toString) && !i(r = n.call(t))) return r;
                    throw TypeError("Can't convert object to primitive value")
                }
            }, function (t, e) {
                var n = 0,
                    i = Math.random();
                t.exports = function (t) {
                    return "Symbol(".concat(void 0 === t ? "" : t, ")_", (++n + i).toString(36))
                }
            }, function (t, e, n) {
                var i = n(45),
                    r = n(12);
                n(38)("keys", function () {
                    return function (t) {
                        return r(i(t))
                    }
                })
            }, function (t, e, n) {
                var i = n(11),
                    r = n(39)(!1);
                i(i.S, "Object", {
                    values: function (t) {
                        return r(t)
                    }
                })
            }, function (t, e) {}, function (t, e) {}, function (t, e) {}, function (t, e, n) {
                var i, r;
                n(52), i = n(15);
                var s = n(62);
                r = i = i || {}, "object" != typeof i["default"] && "function" != typeof i["default"] ||
                    (r = i = i["default"]), "function" == typeof r && (r = r.options), r.render = s.render,
                    r.staticRenderFns = s.staticRenderFns, t.exports = i
            }, function (t, e, n) {
                var i, r;
                i = n(16);
                var s = n(59);
                r = i = i || {}, "object" != typeof i["default"] && "function" != typeof i["default"] ||
                    (r = i = i["default"]), "function" == typeof r && (r = r.options), r.render = s.render,
                    r.staticRenderFns = s.staticRenderFns, t.exports = i
            }, function (t, e, n) {
                var i, r;
                i = n(17);
                var s = n(60);
                r = i = i || {}, "object" != typeof i["default"] && "function" != typeof i["default"] ||
                    (r = i = i["default"]), "function" == typeof r && (r = r.options), r.render = s.render,
                    r.staticRenderFns = s.staticRenderFns, t.exports = i
            }, function (t, e, n) {
                var i, r;
                n(50), i = n(18);
                var s = n(58);
                r = i = i || {}, "object" != typeof i["default"] && "function" != typeof i["default"] ||
                    (r = i = i["default"]), "function" == typeof r && (r = r.options), r.render = s.render,
                    r.staticRenderFns = s.staticRenderFns, t.exports = i
            }, function (t, e, n) {
                var i, r;
                n(51), i = n(19);
                var s = n(61);
                r = i = i || {}, "object" != typeof i["default"] && "function" != typeof i["default"] ||
                    (r = i = i["default"]), "function" == typeof r && (r = r.options), r.render = s.render,
                    r.staticRenderFns = s.staticRenderFns, t.exports = i
            }, function (module, exports) {
                module.exports = {
                    render: function () {
                        with(this) return _h("div", {
                            staticClass: "numpad"
                        }, [_h("div", {
                            staticClass: "numpad__digits"
                        }, [_l(numbers, function (t) {
                            return _h("number", {
                                attrs: {
                                    number: t
                                }
                            })
                        })]), " ", _h("div", {
                            staticClass: "numpad__arrows"
                        }, [_h("div", {
                            staticClass: "numpad__digit"
                        }, [_h("button", {
                            ref: "previousButton",
                            "class": {
                                "is-disabled": activeIndex <=
                                    0
                            },
                            attrs: {
                                disabled: activeIndex <= 0 ||
                                    !this.isOpen
                            },
                            on: {
                                click: function (t) {
                                    goToPrevious()
                                },
                                mouseup: function (t) {
                                    blurEl($refs.previousButton)
                                },
                                touchstart: function (t) {
                                    arrowPressed("left")
                                },
                                touchend: goToPrevious
                            }
                        }, [_h("svg", {
                            staticClass: "triangle",
                            attrs: {
                                viewBox: "0 0 32 32"
                            }
                        }, [_h("path", {
                            staticClass: "path1",
                            attrs: {
                                d: "M22.4 8v16l-14.4-8 14.4-8z"
                            }
                        })])]), " ", _h("div", {
                            staticClass: "numpad__ripple",
                            "class": {
                                "is-pressed": arrowKeys.left
                                    .pressed
                            }
                        })]), " ", _h("div", {
                            staticClass: "numpad__digit"
                        }, [_h("button", {
                            ref: "nextButton",
                            "class": {
                                "is-disabled": activeIndex >
                                    2
                            },
                            attrs: {
                                disabled: activeIndex > 2 ||
                                    !this.isOpen
                            },
                            on: {
                                click: function (t) {
                                    goToNext()
                                },
                                mouseup: function (t) {
                                    blurEl($refs.nextButton)
                                },
                                touchstart: function (t) {
                                    arrowPressed(
                                        "right")
                                },
                                touchend: goToNext
                            }
                        }, [_h("svg", {
                            staticClass: "triangle",
                            attrs: {
                                viewBox: "0 0 32 32"
                            }
                        }, [_h("path", {
                            staticClass: "path1",
                            attrs: {
                                d: "M24 16l-14.4 8v-16l14.4 8z"
                            }
                        })])]), " ", _h("div", {
                            staticClass: "numpad__ripple",
                            "class": {
                                "is-pressed": arrowKeys.right
                                    .pressed
                            }
                        })])])])
                    },
                    staticRenderFns: []
                }
            }, function (module, exports) {
                module.exports = {
                    render: function () {
                        with(this) return _h("div", {
                            staticClass: "timepicker__active-bg",
                            style: transform
                        })
                    },
                    staticRenderFns: []
                }
            }, function (module, exports) {
                module.exports = {
                    render: function () {
                        with(this) return _h("div", {
                            staticClass: "numpad__digit"
                        }, [_h("button", {
                            ref: "numButton",
                            "class": {
                                "is-disabled": !number.active
                            },
                            attrs: {
                                disabled: isDisabled
                            },
                            on: {
                                mousedown: function (t) {
                                    digitPressed(number.value)
                                },
                                mouseup: selectedDigit,
                                touchstart: function (t) {
                                    digitPressed(number.value)
                                },
                                touchend: function (t) {
                                    digitSelected(number.value, t)
                                }
                            }
                        }, ["\n    " + _s(number.value) + "\n  "]), " ", _h(
                            "div", {
                                staticClass: "numpad__ripple",
                                "class": {
                                    "is-pressed": number.pressed
                                }
                            })])
                    },
                    staticRenderFns: []
                }
            }, function (module, exports) {
                module.exports = {
                    render: function () {
                        with(this) return _h("div", {
                            staticClass: "time-unit"
                        }, [_h("transition-group", {
                            attrs: {
                                name: transitionName,
                                tag: "div"
                            }
                        }, [_l(numbers, function (t) {
                            return _h("div", {
                                key: t,
                                staticClass: "time-unit__value",
                                on: {
                                    click: function (t) {
                                        setActiveIndex(
                                            index)
                                    }
                                }
                            }, ["\n        " + _s(t) +
                                "\n      "
                            ])
                        })])])
                    },
                    staticRenderFns: []
                }
            }, function (module, exports) {
                module.exports = {
                    render: function () {
                        with(this) return _h("div", {
                            staticClass: "timepicker-wrap"
                        }, [_h("svg", {
                            staticClass: "timepicker-icon timepicker-icon__clock",
                            attrs: {
                                viewBox: "0 0 32 32"
                            }
                        }, [_h("path", {
                            staticClass: "path1",
                            attrs: {
                                d: "M20.586 23.414l-6.586-6.586v-8.828h4v7.172l5.414 5.414zM16 0c-8.837 0-16 7.163-16 16s7.163 16 16 16 16-7.163 16-16-7.163-16-16-16zM16 28c-6.627 0-12-5.373-12-12s5.373-12 12-12c6.627 0 12 5.373 12 12s-5.373 12-12 12z"
                            }
                        })]), " ", _h("input", {
                            ref: "timeInput",
                            staticClass: "time",
                            attrs: {
                                type: "text"
                            },
                            domProps: {
                                value: value
                            },
                            on: {
                                focus: open
                            }
                        }), " ", _h("div", {
                            ref: "timepicker",
                            staticClass: "timepicker",
                            "class": {
                                "is-open": isOpen
                            },
                            attrs: {
                                tabindex: "0"
                            }
                        }, [_m(0), " ", _h("div", {
                            staticClass: "timepicker__time"
                        }, [_h("div", {
                            staticClass: "flex-wrap"
                        }, [_h("time-unit", {
                            attrs: {
                                index: "0"
                            },
                            domProps: {
                                value: time[0]
                            }
                        }), " ", _h("time-unit", {
                            attrs: {
                                index: "1"
                            },
                            domProps: {
                                value: time[1]
                            }
                        }), " ", _m(1), " ", _h(
                            "time-unit", {
                                attrs: {
                                    index: "2"
                                },
                                domProps: {
                                    value: time[2]
                                }
                            }), " ", _h("time-unit", {
                            attrs: {
                                index: "3"
                            },
                            domProps: {
                                value: time[3]
                            }
                        }), " ", _h("active-background")])]), " ", _h(
                            "numpad")])])
                    },
                    staticRenderFns: [function () {
                        with(this) return _h("div", {
                            staticClass: "timepicker__header"
                        }, ["\n      Set time\n    "])
                    }, function () {
                        with(this) return _h("div", {
                            staticClass: "timepicker__separator"
                        }, [":"])
                    }]
                }
            }])
        });
    </script>
    <!--WTF end-->
</head>

<body>
    <div id="app">
        <div class="instructions">You can use your keyboard to navigate</div>
        <timepicker v-model="time"> </timepicker>
    </div>
    <script>
        /*
         * https://github.com/ispal/vue-timepickr
         */
        Vue.component('timepicker', window.VueTimepickr.default);

        new Vue({
            el: '#app',
            data: ({
                time: '13:20'
            })
        });
    </script>
</body>

</html>